Berikut adalah cara merefresh halaman web namun hanya sebagian. Terkadang kita membutuhkan merefresh suatu bagian pada halaman website yang kita buat tanpa perlu mereload keseluruhan halaman. Hal ini berguna untuk mempercepat performa dari website atau sistem informasi kita. Ini umumnya digunakan pada saat mengupdate data lalu kita perlu melakukan refresh karena data telah berhasil dibuat. Berikut adalah simulasi refresh otomatis yang saya buat dengan menggunakan php, javascript, dan ajax. semoga bermanfaat
Caranya adalah sebagai berikut
1. Buat file index.php
<html>
<head>
<title></title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var id = 1;
$("#refres").click(function () {
$.ajax({
url:"text.php",
method:"POST",
data:{id:id},
success:function(data){
$('#Container').html(data);
alert('Berhasil Refresh');
}
});
});
});
</script>
<body>
<button value="Refresh" id="refres">REFRESH</button>
<div id="Container" style="width:300px; text-align:center; height:100px; border: 1px solid black">
<?php include "text.php" ?>
</div>
</body>
</html>
2. Buat file text.php
File text.php ini adalah file yang akan di refresh. Kita dapat menggantinya dengan kode tampilan tabel database atau lainnya. Saya hanya menampilkan simulasi saja.
<?php echo "Teks Area Ini Yang Di Refresh" ?>
Demikianlah tutorial kali ini. Semoga Bermanfaat.
